<template>
  <div>
    <div class="content-box">
      <el-row class="title">
        <el-col :span="12">关键体征数据</el-col>
        <el-col :span="12" style="text-align: right">
          <i class="glyphicon glyphicon-pencil" style="cursor: pointer"></i>
        </el-col>
      </el-row>
      <el-row>
        <el-col class="case_line_box" :span="24">
          <span class="line_label">
            身高(CM)：
            <label v-if="signForm">{{ signForm.height }}</label
            >Cm
          </span>
          <div class="case_options_box">
            <el-button icon="el-icon-edit" @click="editSign(1)" size="mini">编辑</el-button>
            <!-- <el-button icon="el-icon-view">查看曲线图</el-button> -->
          </div>
        </el-col>
        <el-col class="case_line_box" :span="24">
          <span class="line_label">
            体重(Kg)：
            <label v-if="signForm">{{ signForm.weight }}</label
            >Kg
          </span>
          <div class="case_options_box">
            <el-button icon="el-icon-edit" @click="editSign(2)" size="mini">编辑</el-button>
            <!-- <el-button icon="el-icon-view">查看曲线图</el-button> -->
          </div>
        </el-col>
        <el-col class="case_line_box" :span="24">
          <span class="line_label">
            BMI：
            <label v-if="signForm">{{ signForm.bmi }}</label>
          </span>
          <div class="case_options_box">
            <!-- <el-button icon="el-icon-view">查看曲线图</el-button> -->
          </div>
        </el-col>
        <el-col v-if="showDown" class="case_line_box" :span="24">
          <span class="line_label">
            体温(℃)：
            <label v-if="signForm">{{ signForm.temperature }}</label>
          </span>
          <div class="case_options_box">
            <el-button icon="el-icon-edit" @click="editSign(3)" size="mini">编辑</el-button>
            <!-- <el-button icon="el-icon-view">查看曲线图</el-button> -->
          </div>
        </el-col>
        <el-col v-if="showDown" class="case_line_box" :span="24">
          <span class="line_label">
            呼吸(次/分钟)：
            <label v-if="signForm">{{ signForm.breathing }}</label>
          </span>
          <div class="case_options_box">
            <el-button icon="el-icon-edit" @click="editInfo(1)" size="mini">编辑</el-button>
            <!-- <el-button icon="el-icon-view">查看曲线图</el-button> -->
          </div>
        </el-col>
        <el-col v-if="showDown" class="case_line_box" :span="24">
          <span class="line_label">
            脉搏(次/分钟)：
            <label v-if="signForm">{{ signForm.pulse }}</label>
          </span>
          <div class="case_options_box">
            <el-button icon="el-icon-edit" @click="editInfo(2)" size="mini">编辑</el-button>
            <!-- <el-button icon="el-icon-view">查看曲线图</el-button> -->
          </div>
        </el-col>
        <el-col v-if="showDown" class="case_line_box" :span="24">
          <span class="line_label">
            血压(mmHg)：(收缩压：
            <label v-if="signForm">{{ signForm.systolicPressure }}</label
            >) (舒张压： <label v-if="signForm">{{ signForm.diastolicpressure }}</label
            >)
          </span>
          <div class="case_options_box">
            <el-button icon="el-icon-edit" @click="editSign(4)" size="mini">编辑</el-button>
            <!-- <el-button icon="el-icon-view">查看曲线图</el-button> -->
          </div>
        </el-col>
        <el-col v-if="showDown" class="case_line_box" :span="24">
          <span class="line_label">
            氧饱和度(%)：
            <label v-if="signForm">{{ signForm.oxygenSaturation }}</label>
          </span>
          <div class="case_options_box">
            <!-- <el-button icon="el-icon-edit" @click="editSign(7)" size="mini">编辑</el-button> -->
            <!-- <el-button icon="el-icon-view">查看曲线图</el-button> -->
          </div>
        </el-col>
        <el-col v-if="showDown" class="case_line_box" :span="24">
          <span class="line_label">
            疼痛评分：
            <label v-if="signForm">{{ signForm.painScore }}</label>
          </span>
          <div class="case_options_box">
            <!-- <el-button icon="el-icon-edit" @click="editSign(8)" size="mini">编辑</el-button> -->
            <!-- <el-button icon="el-icon-view">查看曲线图</el-button> -->
          </div>
        </el-col>
        <el-col v-if="showDown" class="case_line_box" :span="24">
          <span class="line_label">
            视力：(左眼视力：
            <label v-if="signForm">{{ signForm.leftEye }}</label
            >) (右眼视力： <label v-if="signForm">{{ signForm.rightEye }}</label
            >)
          </span>
          <div class="case_options_box">
            <el-button icon="el-icon-edit" @click="editSign(9)" size="mini">编辑</el-button>
            <!-- <el-button icon="el-icon-view">查看曲线图</el-button> -->
          </div>
        </el-col>
        <el-col v-if="showDown" class="case_line_box" :span="24">
          <span class="line_label">
            血糖(mmol/I)：
            <label v-if="signForm">{{ signForm.bloodsugar }}</label>
          </span>
          <div class="case_options_box">
            <el-button icon="el-icon-view" @click="getSugerDetail()" size="mini">查看详情</el-button>
            <!-- <el-button icon="el-icon-view">查看曲线图</el-button> -->
          </div>
        </el-col>
      </el-row>
      <!-- <el-row style="margin-top:10px;text-align:center;">
        <el-button @click="down()">{{down_label}}</el-button>
      </el-row>-->
    </div>
    <div class="content-box" style="margin-top: 20px">
      <el-row class="title">
        <el-col :span="12">
          历史病历
          <!-- <el-link @click="getHospital()" style="margin-left:20px;" >查看</el-link> -->
        </el-col>
        <el-col :span="12" style="text-align: right"></el-col>
      </el-row>
      <el-collapse v-model="activeIndex" accordion>
        <el-collapse-item v-for="(item, index) in tableList" :key="index" :name="index + ''">
          <div class="form-tool" slot="title" style="width: 98%">
            <div>
              <span class="vertical-middle" style="font-size: 16px; margin-right: 10px; font-weight: 600">{{ item.treatmentDate }}</span>
              <span class="vertical-middle" style="font-size: 16px; margin-right: 10px; font-weight: 600">{{ item.diagnosisType }}</span>
              <span class="vertical-middle" style="font-size: 16px; margin-right: 10px; font-weight: 600">{{ item.doctorName }}</span>
              <span class="vertical-middle" style="font-size: 16px; margin-right: 10px; font-weight: 600">{{ item.deptName }}</span>
              <!-- <el-badge class="vertical-middle" style="line-height:1;" v-if="item.cureMedicalInfoResponse.cureFirstVisitRecord" :value="item.cureMedicalInfoResponse.cureFirstVisitRecord|toCureFirstVisitRecord">
              </el-badge>-->
              <span style="float: right">
                <!-- <el-button size="mini" v-if="(item.cureMedicalInfoResponse.cureId!=undefined) && (item.deptId!=undefined) && (item.doctorId!=undefined)" @click="onCaseUpdate(item)">修改病历</el-button> -->
                <el-button @click="onPrint(item)" size="mini" :underline="false">打印</el-button>
              </span>
            </div>
          </div>
          <div>
            <el-button v-if="item.cureId != undefined" @click="getReport(item)">查看检查报告</el-button>
            <el-button v-if="item.cureId != undefined" @click="upAssistReport(item)">自带辅助检查</el-button>
          </div>
          <div class="form-box">
            <div v-for="(item2, index2) in item.cureMedicalInfoResponse.dynamicFieldBeans" class="form-item" :key="index2">
              <div v-if="item2.component == 'SELECT' || item2.component == 'RADIO' || item2.component == 'CHECKBOX'">
                <span>{{ item2.name }}：</span>
                <span v-if="item2.name == '初步诊断'">{{ item.cureMedicalInfoResponse.cureFirstVisitRecord | toCureFirstVisitRecord }}</span>
                <span v-else>{{ toArrayStr(item2) }}</span>
              </div>
              <div v-else>
                <span>{{ item2.name }}：</span>
                <span>{{ item2.value }}</span>
              </div>
            </div>
            <div class="form-item">
              既往史：
              <span v-if="item.cureMedicalInfoResponse.curePatientHistory">{{ item.cureMedicalInfoResponse.curePatientHistory.pastHistory }}</span>
            </div>
            <div class="form-item">
              过敏史：
              <span v-if="item.cureMedicalInfoResponse.curePatientAllergy">
                <span v-for="(item, index) in item.cureMedicalInfoResponse.curePatientAllergy" :key="index" style="margin-right: 10px"
                  >{{ item.allergens }},{{ item.allergicReaction }},{{ item.allergicDegree }}</span
                >
              </span>
            </div>
            <div class="form-item">
              个人史：
              <span v-if="item.cureMedicalInfoResponse.curePatientHistory">{{ item.cureMedicalInfoResponse.curePatientHistory.personalHistory }}</span>
            </div>
            <div class="form-item">
              家族史：
              <span v-if="item.cureMedicalInfoResponse.curePatientHistory">{{ item.cureMedicalInfoResponse.curePatientHistory.familyHistory }}</span>
            </div>
            <div class="form-item">
              疫苗接种史：
              <span v-if="item.cureMedicalInfoResponse.curePatientHistory">{{ item.cureMedicalInfoResponse.curePatientHistory.seedlingsHistory }}</span>
            </div>
            <div class="form-item" v-if="item.cureCheckup">实验室检查：{{ item.cureCheckup }}</div>
            <div class="form-item" v-if="item.cureAssistInfo">辅助检查：{{ item.cureAssistInfo }}</div>
            <div class="form-item" v-if="item.cureAdviceInfo">治疗：{{ item.cureAdviceInfo }}</div>
            <div class="form-item" v-if="item.cureMaterialInfo">材料费：{{ item.cureMaterialInfo }}</div>
            <div class="form-item" v-if="item.cureOthersInfo">其他收费：{{ item.cureOthersInfo }}</div>
          </div>
          <div>
            <h4 style="margin: 0">西/成药处方：</h4>
            <div class="form-box">
              <div v-for="(item, index) in item.westernCurePrescriptionInfoResponses" :key="index" class="form-item">
                <template v-for="(item, index) in item.curePrescriptionDrugInfos">
                  <table :Key="index" width="100%" border="0">
                    <tr>
                      <td>{{ index + 1 }}：{{ item.drugName }}</td>
                      <td width="100">{{ item.useTotal }}{{ item.totalUnit | changeAssist(oneDoseUnitArr) }}</td>
                      <td width="100">{{ item.useDay }}天</td>
                    </tr>
                  </table>
                  <div :key="index" style="padding: 0 20px">
                    用法：{{ item.use }}:{{ item.frequency | changeAssist(frequencyArr) }},每次剂量{{ item.oneDose
                    }}{{ item.oneDoseUnit | changeAssist(oneDoseUnitArr) }}
                    <span v-if="item.remark">（{{ item.remark }}）</span>
                  </div>
                </template>
              </div>
            </div>
          </div>
          <div v-for="(item, index) in item.traditionalCurePrescriptionInfoResponses" :key="index">
            <h4 style="margin: 0">中药处方{{ index > 0 ? index : "" }}：</h4>
            <div class="form-box">
              <div class="form-item">
                <div>
                  <span>每副：</span>
                  <span v-for="(item2, index2) in item.curePrescriptionDrugInfos" :key="index2" style="margin-right: 10px"
                    >{{ item2.drugName }} {{ item2.oneDose * item.curePrescriptionUseInfo.totalDose
                    }}{{ item2.oneDoseUnit | changeAssist(oneDoseUnitArr) }}</span
                  >
                </div>
                <div style="padding: 0 20px">
                  共{{ item.curePrescriptionUseInfo.totalDose }}副，{{ item.curePrescriptionUseInfo.frequency | changeAssist(frequencyArr) }}，共{{
                    item.curePrescriptionUseInfo.day
                  }}天
                </div>
              </div>
            </div>
          </div>
        </el-collapse-item>
      </el-collapse>
      <pager v-model="pager" @change-pagenum="getData"></pager>
    </div>
    <dialogHistoryCase v-model="dialogHistoryCase" :patientId="form.patientId" :isSign="isSign" :patientInfo="detail"></dialogHistoryCase>
    <sign
      v-model="dialogSign"
      v-if="dialogSign"
      :type="type"
      :caseType="caseType"
      :patientId="form.patientId"
      :typeLable="typeLable"
      :curItem="curItem"
      @success="getSign"
    ></sign>
    <iframe ref="iframe1" frameborder="0" height="0px" width="0px" src="/print/caseReport.html"></iframe>
    <dialogReport v-model="showReport" v-if="showReport" :cureId="cureId" :patientId="form.patientId"></dialogReport>
    <assist v-model="showAssist" :curItem="activeItem"></assist>
    <editBreathe v-model="dialogBreathe" :curItem="signForm" :type="breatheType" @success="getSign"></editBreathe>
    <!-- <caseUpdate v-model="dialogCaseUpdate" :cureId="cureId" :deptId="deptId" :doctorId="doctorId" ></caseUpdate> -->
  </div>
</template>
<script>
export default {
  props: ["value", "detail"],
  components: {
    sign: () => import("../_com/sign"),
    dialogHistoryCase: () => import("@/pages/process/_com/dialogHistoryCase.vue"),
    dialogReport: () => import("../_com/dialogReport"),
    assist: () => import("../_com/addAssist"),
    editBreathe: () => import("../_com/editBreathe"),
    // caseUpdate: () => import("@/pages/process/_com/caseUpdate.vue")
  },
  computed: {
    patientInfo() {
      return this.$store.state.curPatient;
    },
  },
  filters: {
    toCureFirstVisitRecord(value) {
      let str = "";
      if (value) {
        value.forEach((element) => {
          if (element) {
            if (str) {
              str += "," + element.firstVist;
            } else {
              str = element.firstVist;
            }
          }
        });
      }
      return str;
    },
  },
  data() {
    return {
      dialogCaseUpdate: false,
      btnLoading: false,
      activeIndex: "0",
      pager: { pageSize: 20, pageNum: 1, total: 0 },
      tableList: [],
      isPager: true,
      oneDoseUnitArr: [], //剂量单位
      frequencyArr: [], //频次
      form: {
        patientId: "",
      },
      breatheType: "1",
      dialogBreathe: false,
      dialogSign: false,
      type: 1,
      typeLable: "",
      curItem: [
        {
          date: "",
          value: "",
        },
      ],
      activeItem: "",
      cureId: "",
      deptId: "",
      doctorId: "",
      showReport: false,
      signForm: "",
      showDown: true,
      down_label: "展开",
      isSign: false,
      showAssist: false,
      dialogHistoryCase: false, //历史病例显示
    };
  },
  created() {},
  mounted() {
    let th = this;
    th.getBasic();
  },
  methods: {
    onSubmit() {},
    //获取历史病历
    getData(type) {
      let th = this;
      if (type == -1) {
        th.pager.pageNum = 1;
        th.pager.total = 0;
      }
      let j = {};
      Object.assign(j, th.pager, th.form);
      th.btnLoading = true;
      th.$api.patientHistorypageQueryV2(j).then((res) => {
        let list = res.dataBody.list;
        if (res.executed) {
          //  th.tableList.push(...list);
          th.tableList = list;
          th.pager.total = res.dataBody.total;
        }
        th.btnLoading = false;
        if (list.length < th.pager.pageSize) th.isPager = false;
      });
    },
    //
    getBasic() {
      let th = this;
      let fn = async function () {
        th.form.patientId = th.detail.patientId;
        th.oneDoseUnitArr = await th.getCommonConfigByKey("药品剂量单位");
        th.frequencyArr = await th.getCommonConfigByKey("药品频次");
        th.getData();
        th.getSign();
      };
      fn();
    },
    //特定的值解析|动态病历
    toArrayStr(obj) {
      let th = this;
      let result = [];
      try {
        let arr = JSON.parse(obj.componentValue);
        let valueArr = JSON.parse(obj.value);
        //判断是否多个
        arr.forEach((el) => {
          valueArr.forEach((el2) => {
            if (el2 == el.id) {
              result.push(el.value);
            }
          });
        });
      } catch (error) {}
      return result.join(",");
    },
    onClose() {
      let th = this;
      th.tableList = [];
      th.isPager = true;
      th.$emit("input", false);
    },
    getSign() {
      let th = this;
      th.$api.getPatientSignById({ patientId: th.detail.patientId }).then((res) => {
        if (res.executed) {
          th.signForm = res.patientSign;
          // if (th.signForm) {
          //   if (th.signForm.weight && th.signForm.height) {
          //     let h = Number(th.signForm.height / 100).toFixed(2);
          //     th.signForm.bmi = Number(
          //       th.signForm.weight / Number(h * h).toFixed(2)
          //     ).toFixed(2);
          //   }
          // }
        }
      });
    },
    editSign(type) {
      let th = this;
      th.dialogSign = true;
      th.caseType = type;
      switch (type) {
        case 1:
          th.type = "身高";
          th.typeLable = "身高(CM)";
          break;
        case 2:
          th.type = "体重";
          th.typeLable = "体重(Kg)";
          break;
        case 3:
          th.type = "体温";
          th.typeLable = "体温(℃)";
          break;
        case 4:
          th.type = "血压";
          th.typeLable = "血压(mmHg)";
          // th.type="呼吸";
          // th.typeLable="呼吸(次/分钟)";
          break;
        case 5:
          th.type = "脉搏";
          th.typeLable = "脉搏(次/分钟)";
          break;
        case 6:
          th.type = "血压";
          th.typeLable = "血压(mmHg)";
          break;
        case 7:
          th.type = "氧饱和度";
          th.typeLable = "氧饱和度(%)";
          break;
        case 8:
          th.type = "疼痛评分";
          th.typeLable = "疼痛评分";
          break;
        case 9:
          th.type = "视力";
          th.typeLable = "视力";
          break;
      }
      //
    },
    down() {
      let th = this;
      th.showDown = !th.showDown;
      if (th.showDown == true) {
        th.down_label = "收起";
      } else {
        th.down_label = "展开";
      }
    },
    //获取血糖详情
    getSugerDetail() {
      let th = this;
      let j = {};
      if (th.detail != null) {
        j = {
          id: th.jiaMi(th.detail.patientId),
        };
      } else {
        j = {
          id: th.jiaMi(0),
        };
      }
      th.$router.push({
        path: "/page/sugarDetail",
        query: th.getUrlToken(j),
      });
    },
    getHospital() {
      let th = this;
      th.dialogHistoryCase = true;
    },
    onCaseUpdate(obj) {
      let th = this;
      th.cureId = obj.cureMedicalInfoResponse.cureId;
      th.doctorId = obj.doctorId;
      th.deptId = obj.deptId;
      th.dialogCaseUpdate = true;
    },
    getReport(obj) {
      let th = this;
      if (obj.cureId) {
        th.cureId = obj.cureId;
        th.showReport = true;
      }
    },
    onPrint(obj) {
      let th = this;
      let json = {
        hospital: {
          name: th.adminUser.hospitalName,
          logo: th.adminUser.printLogo,
          province: th.adminUser.hospitalProvince,
          city: th.adminUser.hospitalCity,
          district: th.adminUser.hospitalDistrict,
          address: th.adminUser.hospitalAddress,
        },
        deptName: obj.deptName,
        professionalDeptName: obj.professionalDeptName,
        doctorName: obj.doctorName,
        time: obj.treatmentDate,
        cureFirstVisitRecord: obj.cureMedicalInfoResponse.cureFirstVisitRecord, //诊断
        patientInfo: th.detail,
        dataForm: obj.cureMedicalInfoResponse.dynamicFieldBeans || [], //动态病历
        curePatientAllergy: obj.cureMedicalInfoResponse.curePatientAllergy || [], //过敏史
        curePatientHistory: obj.cureMedicalInfoResponse.curePatientHistory || {}, //个人历史
        occupationEnum: th.occupationEnum, //职业
        nationEnum: th.nationEnum, //婚姻
        useEnum: th.useEnum, //用法
        traditionRecipe: [], //中药
        westwardRecipe: [], //西药
        unitEnum: th.oneDoseUnitArr, //单位
        frequencyEnum: th.frequencyArr, //频次
      };
      //西药
      if (obj.westernCurePrescriptionInfoResponses && obj.westernCurePrescriptionInfoResponses.length > 0) {
        json.westwardRecipe = obj.westernCurePrescriptionInfoResponses[0].curePrescriptionDrugInfos;
      }
      //中药
      if (obj.traditionalCurePrescriptionInfoResponses && obj.traditionalCurePrescriptionInfoResponses.length > 0) {
        json.traditionRecipe = obj.traditionalCurePrescriptionInfoResponses;
      }
      th.$refs["iframe1"].contentWindow.postMessage(json, `${window.location.origin}/print/caseReport.html`);
    },
    //上传辅助检查
    upAssistReport(obj) {
      let th = this;
      th.showAssist = true;
      th.activeItem = obj;
    },
    editInfo(type) {
      const th = this;
      th.breatheType = type;
      th.dialogBreathe = true;
    },
  },
};
</script>
<style lang="scss" scoped>
@import "../_css/detail.scss";
.form-box {
  .form-item {
    padding: 10px 0;
    border-top: 1px solid #eee;
    &:first-child {
      border-top-color: transparent;
    }
  }
}
.content-box {
  border: none;
}
.visit_detail_box .content-box .title {
  background: none;
  padding-left: 0;
}
</style>
